.box{
	width: 200px;
	height: 200px;
	border: 1px solid bisque;
	text-align: center;
	font-size: 32px;
	/*浮动:让块级盒子水平摆放*/
	/*浮动:float left(左浮动),right右 none（默认值）*/
	float: left;
}

.clear{
	/* 清除两端浮动 */
	clear: both;
	}
	/* 第二种清除浮动的方法 */
.bigbox{
	overflow: hidden;
}
/* 第三种清除浮动的方法 */（重点）
.clearfix::after{  /* 伪类:在clearfix类后面的内容 */
	content: "";/* 内容:空 */
	display:block;/* 将伪类转化为块元素 */
	height: 0;
	clear: both;/* 清除两端浮动 */
	visibility: hidden;/* 显示状态:隐藏 */
}
/* 第四种清除浮动的方法 */（重点）
.clearfix::before,.clearfix::after{
	content: "";
	display: table;
}

/*浮动的特性:
1.浮动的盒子会脱离标准流(脱标)
2.浮动的盒子一行内显示并且顶端对齐，一行装不下会另起一行。
3.浮动的盒子具有和行内块元素类似的特性。
*/
/*清清除浮动的方法：
1.额外标签法：隔墙法（不建议使用）
2.给父级元素添加overflow：hidden属性
3.给父级元素添加after伪元素    after
4.给父级元素添加双伪元素
*/